
// var tabItem = document.getElementsByClassName("tab-item");
// var pageItem = document.getElementsByClassName("page-item");
// // console.log(tabItem, pageItem);

// ;(function(tab, page){
//   for(let i = 0; i < tab.length; i++){
//     tab[i].onclick = function(){
//       for(let j  = 0; j < page.length; j++){
//         tab[j].className = "tab-item";
//         page[j].className = "page-item";
//       }
//       this.classList.toggle("cur");
//       page[i].classList.toggle("active");
//     }
//   }
// })(tabItem, pageItem);


;(function(){
  var Tab = function(opt){
    this.tabs = document.getElementsByClassName(opt.tabItem);
    this.pages = document.getElementsByClassName(opt.pageItem);

  this.bindClick(opt.tabItem, opt.pageItem, opt.cur, opt.active);
  }

  Tab.prototype = {
    bindClick: function(tabItem, pageItem, cur, active){
      var tabs = this.tabs,
          pages = this.pages;
        for(let i = 0; i < tabs.length; i++){
          tabs[i].onclick = function(){
            for(let j  = 0; j < pages.length; j++){
              tabs[j].className = tabItem;
              pages[j].className = pageItem;
            }
            tabs[i].classList.toggle(cur);
            pages[i].classList.toggle(active);
          }
        }
      
    }
  }

  window.Tab = Tab;
})()




